<template>
  <div>
    <h3>我是childB</h3>
    <p>直接state：{{ $store.state.username }}   </p>
    <p>user - state：{{ $store.state.user.token }}   </p>
    <p>user - getters - state：{{ $store.getters.token }}   </p>
    <p>user -辅助函数- getters - state：{{ token }}   </p>

    <button @click="changeToken2">修改 token</button>
    <button @click="changeToken3">修改 token 3333</button>

    <button @click="changeToken">修改 token-- new</button>
  </div>
</template>

<script>
import { mapGetters, mapMutations, createNamespacedHelpers } from 'vuex'

const { mapMutations: userMapMutations } = createNamespacedHelpers('user')

export default {
  computed: {
    ...mapGetters(['token'])
  },
  methods: {
    ...mapMutations(['user/changeToken']),
    ...userMapMutations(['changeToken']),
    changeToken2() {
      this.$store.commit('user/changeToken')
    },
    changeToken3() {
      this['user/changeToken']()
    }
  }
}
</script>

<style>

</style>